body {
  --primary: #007bff;
  --secondary: #6c757d;
  --success: #28a745;
  --danger: #dc3545;
  --warning: #ffc107;
  --light: #f8f9fa;
  --dark: #343a40;
  --muted: #6c757d;
  --white: #fff;
  --borderColor: #dee2e6;
  --lightmuted: #b2b2b2;
}

html {
  height: 100%;
}



.df {
  display: flex;
}

.aic {
  align-items: center;
}

.jcc {
  justify-content: center;
}

.fdc {
  flex-direction: column;
}

.jcsb {
  justify-content: space-between;
}

.f1 {
  flex: 1;
}

.fn {
  flex: none;
}